<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>管理员设置</title>
    <link href="/resources/hotel/css/style.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="/resources/hotel/js/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="/resources/hotel/js/util.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $(".click").click(function () {
                $(".tip").fadeIn(200);
            });

            $(".tiptop a").click(function () {
                $(".tip").fadeOut(200);
            });

            $(".sure").click(function () {
                $(".tip").fadeOut(100);
            });

            $(".cancel").click(function () {
                $(".tip").fadeOut(100);
            });

        });
    </script>
    <style type="text/css">
        .tablelist input {
            height: 30px;
            border: #00a4ac solid 0.3px;
        }

        #addUlTh li {
            font-size: 15px;
            margin-top: 10px;
            text-align: right;
        }

        #addUlTd li {
            margin-top: 10px;
        }

        #addUlTd li input {
            height: 20px;
        }

        #modifyUlTh li {
            font-size: 15px;
            margin-top: 10px;
            text-align: right;
        }

        #modifyUlTd li {
            margin-top: 10px;
        }

        #modifyUlTd li input {
            height: 20px;
        }

        input {
            border: #00a4ac 0.3px solid;
        }
    </style>

</head>


<body>

<div class="place">
    <span>位置：</span>
    <ul class="placeul">
        <li><a href="#">酒店信息管理</a></li>
        <li><a href="#">管理员设置</a></li>
    </ul>
</div>

<div class="rightinfo">
    <!--添加按钮-->
    <div class="tools">
        <ul class="toolbar">
            <li id="addButton"><span><img src="/resources/hotel/images/t01.png"/></span>添加</li>
        </ul>
    </div>
    <!--添加框-->
    <form id="addForm">
        <div class="tip" style="height: 450px; display: none;" id="addDiv">
            <div class="tiptop"><span>添加管理员信息</span><a></a></div>
            <div style="margin-left: 10px;">
                <div style="float: left;">
                    <ul id="addUlTh">
                        <li>管理员账号</li>
                        <li>管理员密码</li>
                        <li>联系电话</li>
                    </ul>
                </div>
                <div style="float: left;margin-left: 10px;">
                    <ul id="addUlTd">
                        <li><input type="text" onkeyup="checkLength(this,20)" placeholder="管理员用户名"
                                   id="addInputMUsername" name="mUsername"></li>
                        <li>
                            <input type="text" onkeyup="checkLength(this,20)" placeholder="管理员密码" id="addInputMPassword"
                                   name="mPassword">
                        </li>
                        <li><input type="text" onkeyup="value=value.replace(/[^\d]/g,''),checkLength(this,11)"
                                   id="addInputDTel" name="mPhone"></li>
                    </ul>
                </div>
            </div>
            <div class="tipbtn" style="position: absolute;top:-90px;">
                <input name="" type="button" class="sure" value="确定添加" id="addOK"/>&nbsp;
                <input name="" type="button" class="cancel" value="取消"/>
            </div>
        </div>
    </form>

    <!--修改框-->
    <form id="modifyForm">
        <div class="tip" style="height: 450px; display: none;" id="modifyDiv">
            <div class="tiptop"><span>添加管理员信息</span><a></a></div>
            <div style="margin-left: 10px;">
                <div style="float: left;">
                    <ul id="modifyUlTh">
                        <li>管理员密码</li>
                        <li>联系电话</li>
                    </ul>
                </div>
                <div style="float: left;margin-left: 10px;">
                    <ul id="modifyUlTd">
                        <li>
                            <input type="text" onkeyup="checkLength(this,20)" placeholder="管理员密码"
                                   id="modifyInputMPassword" name="mPassword">
                        </li>
                        <li><input type="text" onkeyup="value=value.replace(/[^\d]/g,''),checkLength(this,11)"
                                   id="modifyInputDTel" name="mPhone"></li>
                    </ul>
                </div>
            </div>
            <div class="tipbtn" style="position: absolute;top:-90px;">
                <input name="" type="button" class="sure" value="确定修改" id="modifyOK"/>&nbsp;
                <input name="" type="button" class="cancel" value="取消"/>
            </div>
        </div>
    </form>
    <!--管理员列表-->
    <div class="formtitle"><span>管理员列表</span></div>
    <table class="tablelist">
        <thead>
        <tr>
            <th>商家账号</th>
            <th>商家密码</th>
            <th>创建时间</th>
            <th>最后修改时间</th>
            <th>管理员类型</th>
            <th>是否在线</th>
            <th>联系电话</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody id="tbody">
        </tbody>
    </table>

    <!--提示信息div-->
    <div class="tip">
        <div class="tiptop"><span>提示信息</span><a></a></div>

        <div class="tipinfo">
            <span><img src="images/ticon.png"/></span>
            <div class="tipright">
                <p>是否确认对信息的修改 ？</p>
                <cite>如果是请点击确定按钮 ，否则请点取消。</cite>
            </div>
        </div>

        <div class="tipbtn">
            <input name="" type="button" class="sure" value="确定"/>&nbsp;
            <input name="" type="button" class="cancel" value="取消"/>
        </div>
    </div>

</div>

<script type="text/javascript">
    $('.tablelist tbody tr:odd').addClass('odd');
</script>
<script>

    //获取当前管理员的信息
    var nowAdminType;
    $.getJSON("http://localhost:8080/merchantController/queryMerchantById", function (data) {
        // console.log(data);
        nowAdminType = data.merchant.mType;
    });

    //点击删除管理员
    function deleteButton(id) {
        if (nowAdminType == 0) {
            if (confirm("您确定要删除吗?")) {
                //点击确认删除
                $.ajax({
                    url: "http://localhost:8080/merchantController/deletemerchant",
                    type: "get",
                    dataType: "json",
                    data: {"mId": id},
                    success: function (data) {
                        if (data.success == true) {
                            alert("删除成功");
                            window.location.reload();
                        } else {
                            alert(data.errMsg);
                        }
                    },
                    error: function (data) {
                        alert("访问错误");
                    }
                });
            }
        } else {
            alert("你不是超级管理员，你删个鸡儿");
        }

    }

    //点击修改框
    function modify(id) {
        if (nowAdminType == 0) {
            $("#modifyDiv").show();
            //点击确认修改
            $("#modifyOK").click(function () {
                var form = $("#modifyForm").serialize();
                form = form + "&mId=" + id;
                $.ajax({
                    url: "http://localhost:8080/merchantController/modfifymerchantinfo",
                    type: "post",
                    dataType: "json",
                    data: form,
                    success: function (data) {
                        if (data.success == true) {
                            alert("修改成功");
                            window.location.reload();
                        } else {
                            alert(data.errMsg);
                        }
                    },
                    error: function (data) {
                        alert("访问错误");
                    }
                });
            })
        } else {
            alert("你不是超级管理员，你改个鸡儿");
        }

    }

    //点击显示添加框
    $("#addButton").click(function () {
        $("#addDiv").show();
    });
    //点击确认添加
    $("#addOK").click(function () {
        var form = $("#addForm").serialize();
        $.ajax({
            url: "http://localhost:8080/merchantController/addmerchant",
            type: "post",
            dataType: "json",
            data: form,
            success: function (data) {
                if (data.success == true) {
                    alert("添加成功");
                    window.location.reload();
                } else {
                    alert(data.errMsg);
                }
            },
            error: function (data) {
                alert("访问错误");
            }
        });
    })
    getAdminList();//获取管理员列表
    function getAdminList(pageNum) {
        $.ajax({
            url: "http://localhost:8080/merchantController/querymerchantlist",
            type: "get",
            dataType: "json",
            data: {"pageNum": pageNum},
            success: function (data) {
                if (data.success == true) {
                    var tbody = $("#tbody");
                    tbody.html("");//清空之前的数据
                    for (var i = 0; i < data.merchants.length; i++) {
                        var merchant = data.merchants[i];
                        var online;
                        if (merchant.online == true) {
                            online = "在线";
                        } else {
                            online = "离线";
                        }
                        var mType;
                        if (merchant.mType == 0) {
                            mType = "普通管理员";
                        } else {
                            mType = "高级管理员";
                        }
                        if (merchant.mType == 0) {
                            var tr = "<tr>" +
                                "<td>" + merchant.mUsername + "</td>" +
                                "<td>" + merchant.mPassword + "</td>" +
                                "<td>" + merchant.mCreateTime + "</td>" +
                                "<td>" + merchant.mLastEditTime + "</td>" +
                                "<td>" + mType + "</td>" +
                                "<td>" + online + "</td>" +
                                "<td>" + merchant.mPhone + "</td>" +
                                "<td><a href=\"#\" class=\"tablelink\" onclick='modify(" + merchant.mId + ")'>修改</a>     <a href='#' class='tablelink' onclick='deleteButton(" + merchant.mId + ")'> 删除</a></td>" +
                                "</tr>";
                            tbody.append(tr);
                        }
                    }
                }
            },
            error: function () {
                alert("访问错误！");
            }
        });
    }
</script>
</body>
</html>
